<template>
  <BasicModal destroyOnClose title="处理任务" v-bind="$attrs" @register="registerModal" @visible-change="handlerVisibleChange">
    <a-tabs v-model:activeKey="activeKey">
      <a-tab-pane key="1" tab="业务表单">
        <BusinessForm :taskId="taskId"/>
      </a-tab-pane>
      <a-tab-pane key="2" tab="任务处理">
        <ActTaskTodoForm />
      </a-tab-pane>
      <a-tab-pane key="3" force-render tab="流程跟踪">流程跟踪</a-tab-pane>
    </a-tabs>
  </BasicModal>
</template>

<script setup lang="ts">
import {ref} from "vue";
import {BasicModal, useModalInner} from "@/components/Modal";
import BusinessForm from "../../../components/BusinessForm/BusunessForm.vue"
import ActTaskTodoForm from "@/views/activiti/task/todo/components/ActTaskTodoForm.vue";

const activeKey = ref('1')
const taskId = ref()

const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
  console.log('useModalInner', data)
  taskId.value = data.taskId
  setModalProps({
    confirmLoading: false,
    showCancelBtn: false,
    showOkBtn: false,
    defaultFullscreen: true,
  })
})

const handlerVisibleChange = (visible: boolean) => {
  console.log('流程实例详情窗口visible', visible)
  if (visible) {
  } else {
    taskId.value = ''
  }
}
</script>

<style scoped lang="less">

</style>
